<template>
	<div style="background-color: rgb(232, 232, 231,0.2);" @click="closeSel">
		<Navigation ref="Navigation"></Navigation>
		<Search :dateCalendar="dateCalendar" :cityCalendar="dateCalendar" :cityCalendarTwo="dateCalendar"></Search>
		<Flights ref="Flights"></Flights>
		<BottomNavigation></BottomNavigation>
	</div>
</template>

<script>
	import Navigation from "../components/Navigation"
	import Search from "../components/Search"
	import Flights from "../components/Flights"
	import BottomNavigation from "../components/BottomNavigation"

	export default {
		data() {
			return {
				dateCalendar: null
			}
		},
		components: {
		 Navigation,
			Search,
			Flights,
			BottomNavigation
		},
		methods: {
			loginOpen(){
				return this.$refs["Navigation"].loginCall();
			},
			closeSel(event) {
				this.dateCalendar = event;
			},
			updateInformation() {
				this.$nextTick(() => {
					this.$refs["Flights"].oneWay();
				});
			}
		}
	}
</script>

<style>
</style>
